<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org" >

<head >

	<!-- Basic -->
	<meta charset="UTF-8" />

	<title>首页 | Nadhif - Responsive Admin Template</title>

	<!-- Mobile Metas -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

	<!-- Import google fonts -->

	<!-- Favicon and touch icons -->
	<link rel="shortcut icon" href="/ico/favicon.ico" type="image/x-icon" />
	<link rel="apple-touch-icon" href="../static/ico/apple-touch-icon.png" />
	<link rel="apple-touch-icon" sizes="57x57" href="../static/ico/apple-touch-icon-57x57.png" />
	<link rel="apple-touch-icon" sizes="72x72" href="../static/ico/apple-touch-icon-72x72.png" />
	<link rel="apple-touch-icon" sizes="76x76" href="../static/ico/apple-touch-icon-76x76.png" />
	<link rel="apple-touch-icon" sizes="114x114" href="../static/ico/apple-touch-icon-114x114.png" />
	<link rel="apple-touch-icon" sizes="120x120" href="../static/ico/apple-touch-icon-120x120.png" />
	<link rel="apple-touch-icon" sizes="144x144" href="../static/ico/apple-touch-icon-144x144.png" />
	<link rel="apple-touch-icon" sizes="152x152" href="../static/ico/apple-touch-icon-152x152.png" />

	<!-- start: CSS file-->

    <script src="/plugins/modernizr/js/modernizr.js"></script>
	<script src="/js/jquery.mmenu.min.js"></script>
	<!-- Vendor CSS-->
	<link href="/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
	<link href="/vendor/skycons/css/skycons.css" rel="stylesheet" />
	<link href="/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" />

	<!-- Plugins CSS-->
	<link href="/plugins/bootkit/css/bootkit.css" rel="stylesheet" />
	<link href="/plugins/scrollbar/css/mCustomScrollbar.css" rel="stylesheet" />
	<link href="/plugins/fullcalendar/css/fullcalendar.css" rel="stylesheet" />
	<link href="/plugins/jquery-ui/css/jquery-ui-1.10.4.min.css" rel="stylesheet" />
	<link href="/plugins/xcharts/css/xcharts.min.css" rel="stylesheet" />
	<link href="/plugins/morris/css/morris.css" rel="stylesheet" />

	<!-- Theme CSS -->
	<link href="/css/jquery.mmenu.css" rel="stylesheet" />

	<!-- Page CSS -->
	<link href="/css/style.css" rel="stylesheet" />
	<link href="/css/add-ons.min.css" rel="stylesheet" />
	<!-- end: CSS file-->
	<script>

		window.onload=function(){


			$("#collect-cont").load("/getAllCollect");



			$.ajax({
				type:"POST",
				dataType:"JSON",
				contentType: "application/json;charset=UTF-8",
				url:"/index",
				data:JSON.stringify({
					id:localStorage.getItem("id")
				}),
				beforeSend: function (XMLHttpRequest) {
					XMLHttpRequest.setRequestHeader("token",localStorage.getItem("token"));
				},

				success:
						function (Response) {
							$("#username2").html("欢迎  "+Response.msg.userName);
							$("#username3").html(Response.msg.userName);
						},
				error:function () {
					console.log("错误")
				}
			})
			//获取收藏夹

		}
        function getfavorites() {
            $("#favoriteContent").html("");
            $.ajax({
                type: "POST",
                dataType: "JSON",
                contentType: "application/json;charset=UTF-8",
                url: "/getFavorites",
                data: JSON.stringify({
                    id: localStorage.getItem("id")
                }),
                beforeSend: function (XMLHttpRequest) {
                    XMLHttpRequest.setRequestHeader("token", localStorage.getItem("token"));
                },

                success:
                    function (Response) {

                        Response.msg.forEach(function (item,index) {

                            $("#favoriteContent").html(
                                $("#favoriteContent").html()+"<li><a class=\"favo-name\" onclick=\"collectCon("+item.id+")\" style=\"cursor:pointer;\"><span>"+item.name+"</span></a></li>"
                            )
                        })

                    },
                error: function () {
                    console.log(Response.msg)
                }
            })
			stopPropagation();
        }
    //获取收藏夹


		//新建收藏夹
		function newfavorites() {
            $("#content3").show();//显示输入框
            $("#collectContent").hide();//隐藏收藏内容
            $("#collectButton").hide()//隐藏收藏按钮
			$("#collect-cont").hide();
			$("#mypersonal-data").hide()
			$("#noRead").hide()//影藏未读列表
			$("#allpersonal-data").hide();
			$("#personal-data").hide();
			$("#personal-search").hide();
			$("#follow-personal-data").hide();
		}
		function favo() {
			$.ajax({
				type:"POST",
				dataType:"JSON",
				contentType: "application/json;charset=UTF-8",
				url:"/addfavorites",
				data:JSON.stringify({
					userId:localStorage.getItem("id"),
					name:$("#favoriteName").val()
				}),
				beforeSend: function (XMLHttpRequest) {
					XMLHttpRequest.setRequestHeader("token",localStorage.getItem("token"));
				},
				success:
						function (Response) {
							if(Response.code==0){
								alert(Response.msg);
								//console.log(Response);
							}
							else
								alert(Response.msg);
								//console.log(Response);
				},
				error:
				function (Response) {
							alert(Response.msg);
				}
			})
		}

		var id1;
		function collectCon(id){

            $("#content3").hide();//隐藏输入框
            $("#collectContent").show();//显示收藏内容
            $("#collectButton").hide()//隐藏收藏按钮
			$("#collect-cont").hide();
			$("#noRead").hide()//影藏未读列表
			$("#personal-data").hide()
			$("#mypersonal-data").hide()
			$("#allpersonal-data").hide();
			$("#follow-personal-data").hide();
			$("#personal-search").hide();
			$("#collectBox1-c").load("/getCollectByFavoriteId?id="+id);
				id1 =id;
			stopPropagation();
		}
        //收藏按钮
    function collectBtn(){
        $("#content3").hide();//隐藏输入框
        $("#collectContent").hide();//隐藏收藏内容
        $("#collectButton").show()//显示收藏按钮
		$("#collect-cont").hide()
		$("#noRead").hide()//影藏未读列表
		$("#allpersonal-data").hide();
		$("#mypersonal-data").hide()
		$("#personal-data").hide();
		$("#personal-search").hide();
		$("#follow-personal-data").hide();
    }



       //触发事件
		function stopPropagation(e) {
			e = e || window.event;
			if(e.stopPropagation) { //W3C阻止冒泡方法
				e.stopPropagation();
			} else {
				e.cancelBubble = true; //IE阻止冒泡方法
			}
		}

		function toindex(){
			window.location.reload();
		}



		function noRead() {
			$("#content3").hide();//隐藏输入框
			$("#collectContent").hide();//隐藏收藏内容
			$("#collectButton").hide()//显示收藏按钮
			$("#collect-cont").hide();//隐藏分类收藏内容
			$("#personal-data").hide()
			$("#allpersonal-data").hide();
			$("#mypersonal-data").hide();
			$("#personal-search").hide();
			$("#follow-personal-data").hide();
			$("#noRead").show()//显示未读列表

			$("#noRead").load("/getNoRead?userId="+localStorage.getItem("id"));

		}
	</script>

	<!-- Head Libs -->
	<script src="/plugins/modernizr/js/modernizr.js"></script>

	<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->

</head>

<body>

<!-- Start: Header -->
<div class="navbar" role="navigation">
	<div class="container-fluid container-nav">
		<!-- Navbar Action -->
		<ul class="nav navbar-nav navbar-actions navbar-left">
			<!--<li class="visible-md visible-lg"><a href="index.html#" id="main-menu-toggle"><i class="fa fa-th-large"></i></a></li>-->
			<li class="visible-xs visible-sm"><a href="index.html#" id="sidebar-menu"><i class="fa fa-navicon"></i></a></li>
		</ul>
		<!-- Navbar Left -->
		<div class="navbar-left">
			<!-- Search Form -->

				<div class="input-group input-search" style="width: 300px; margin-top: 10px;">
					<input type="text"  class="form-control" style=" background:#000; color :#fff;"  id="title-search" placeholder="Search...">
					<span class="input-group-btn">
								<button class="btn btn-default"  onclick="search()"><i class="fa fa-search"></i></button>
							</span>
						</div>

				</div>
		<script>
			function search() {
				$('#collect-cont').load('/getAllCollect?title='+$('#title-search').val());
				$("#content3").hide();//隐藏输入框
				$("#collectContent").hide();//隐藏收藏内容
				$("#collectButton").hide()//显示收藏按钮
				$("#collect-cont").show();
				$("#noRead").hide()//影藏未读列表
				$("#allpersonal-data").hide();
				$("#mypersonal-data").hide();
				$("#personal-data").hide();
				$("#personal-search").hide();
				$("#follow-personal-data").hide();
			}


		</script>
				<!-- Navbar Right -->
				<div class="navbar-right">
					<!-- Notifications -->
				<!--	<ul class="notifications hidden-sm hidden-xs">


						<li>
							<a href="#" class="dropdown-toggle notification-icon" data-toggle="dropdown">
								<i class="fa fa-bell"></i>
								<span class="badge">3</span>
							</a>
							<ul class="dropdown-menu list-group">
								<li class="dropdown-menu-header">
									<strong>Notifications</strong>
									<div class="progress progress-xs  progress-striped active">
										<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
											60%
										</div>
									</div>
								</li>
								<li class="list-item">
									<a href="page-inbox.html">
										<div class="pull-left">
										   <i class="fa fa-envelope-o bk-fg-primary"></i>
										</div>
										<div class="media-body clearfix">
											<div>Unread Message</div>
											<h6>You have 10 unread message</h6>
										</div>								
									</a>
								</li>
								<li class="list-item">
									<a href="#">
										<div class="pull-left">
										   <i class="fa fa-cogs bk-fg-primary"></i>
										</div>
										<div class="media-body clearfix">
											<div>New Settings</div>
											<h6>There are new settings available</h6>
										</div>								
									</a>
								</li>
								<li class="list-item">
									<a href="#">
										<div class="pull-left">
										   <i class="fa fa-fire bk-fg-primary"></i>
										</div>
										<div class="media-body clearfix">
											<div>Update</div>
											<h6>There are new updates available</h6>
										</div>								
									</a>
								</li>
								<li class="list-item-last">
									<a href="#">
									  <h6>Unread notifications</h6>
									  <span class="badge">15</span>
								   </a>
								</li>
							</ul>
						</li>
					</ul>-->
					<!-- End Notifications -->
					<!-- Userbox -->
					<div class="userbox">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">
							<div class="profile-info">
								<span id ="username3" class="name"></span>
								<!--<span class="role">Developer</span>-->
							</div>			
							<i class="fa custom-caret"></i>
						</a>
						<div class="dropdown-menu">
							<ul class="list-unstyled">
								<li class="dropdown-menu-header bk-bg-white bk-margin-top-15">						
									<div class="progress progress-xs  progress-striped active">
										<div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
											60%
										</div>
									</div>							
								</li>
								<li>
									<a onclick="mypersonal()" style="cursor: pointer;"><i class="fa fa-user"></i>个人中心</a>
								</li>

							<!--	<li>
									<a href="page-invoice"><i class="fa fa-usd"></i> Payments</a>
								</li>
								<li>
									<a href="#"><i class="fa fa-file"></i> File</a>
								</li>-->
								<li>
									<a href="/getCollectSearch?title="><i class="fa fa-power-off"></i> 退出登录</a>
								</li>
							</ul>
						</div>						
					</div>
					<!-- End Userbox -->
				</div>
				<!-- End Navbar Right -->
			</div>		
		</div>
		<!-- End: Header -->
		<div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >企业网站模板</a></div>
		<!-- Start: Content -->
		<div class="container-fluid content">
			<div class="row">

				<!-- Sidebar -->
				<div class="sidebar">
					<div class="sidebar-collapse">
						<!-- Sidebar Header Logo-->
						<div class="sidebar-header">
							<img src="/img/logo.png" class="img-responsive" alt="" />
						</div>
						<!-- Sidebar Menu-->
						<div class="sidebar-menu">
							<nav id="menu" class="nav-main" role="navigation">
								<ul class="nav nav-sidebar" >
									<div class="panel-body text-center">
										<div class="bk-avatar">
											<img src="/img/avatar.jpg" class="img-circle bk-img-60" alt="" />
										</div>
										<div class="bk-padding-top-10">
											<i class="fa fa-circle text-success"></i> <small id="username2"></small>
										</div>
									</div>
									<div class="divider2"></div>
									<li class="active">
										<a onclick="toindex()" style="cursor: pointer;">
											<i class="glyphicon glyphicon-home" aria-hidden="true"></i><span>首页</span>
										</a>
									</li>
									<li>
										<a onclick="noRead()" style="cursor: pointer;">
											<span class="pull-right label label-primary"></span>
											<i class="glyphicon glyphicon-heart" aria-hidden="true"></i><span>未读列表</span>
										</a>
									</li>
									<li class="nav-parent" onclick="getfavorites()">
										<a>
											<i class="glyphicon glyphicon-file" aria-hidden="true"></i><span>收藏夹</span>
										</a>
										<ul class="nav nav-children" id ="favoriteContent">
										</ul>
									</li>

									<li>
										<a onclick="personalfans()" style="cursor: pointer;">
											<span class="pull-right label label-primary"></span>
											<i class="glyphicon glyphicon-user" aria-hidden="true"></i><span>我的粉丝</span>
										</a>
									</li>

									<li>
										<a onclick="personalfollow()" style="cursor: pointer;">
											<span class="pull-right label label-primary"></span>
											<i class="glyphicon glyphicon-user" aria-hidden="true"></i><span>我的关注</span>
										</a>
									</li>

									<li>
										<a onclick="searchfollow()" style="cursor: pointer;">
											<span class="pull-right label label-primary"></span>
											<i class="	glyphicon glyphicon-plus-sign" aria-hidden="true"></i><span>搜索关注</span>
										</a>
									</li>

									<li>
										<a onclick="newfavorites()" style="cursor: pointer;">
											<span class="pull-right label label-primary"></span>
											<i class="glyphicon glyphicon-plus" aria-hidden="true"></i><span>新建收藏夹</span>
										</a>
									</li>

                                    <li>
                                        <a onclick="collectBtn()" style="cursor: pointer;">
                                            <span class="pull-right label label-primary"></span>
                                            <i class="glyphicon glyphicon-edit" aria-hidden="true"></i><span>收藏工具</span>
                                        </a>
                                    </li>

                                    <li>
                                        <a onclick="getdeleted()" style="cursor: pointer;">
                                            <span class="pull-right label label-primary"></span>
                                            <i class="glyphicon glyphicon-trash" aria-hidden="true"></i><span>回收站</span>
                                        </a>
                                    </li>
								</ul>
							</nav>
						</div>
						<!-- End Sidebar Menu-->
					</div>
					<!-- Sidebar Footer-->
					<div class="sidebar-footer">

					</div>
					<!-- End Sidebar Footer-->
				</div>
				<!-- End Sidebar -->
			</div>

            <div class="main "  >
                <!-- Page Header -->

				<div id ="collect-cont" th:replace="findcollect::collectBox"></div>
                <!--//收藏的网页-->
				<div id="collectContent" class="row" th:replace="f-collectByFavorite::findByFavorite"></div>
                <!--//收藏按钮-->
                <div id="collectButton" style="display: none">
                    <h5>网页收集小工具</h5>
                    <a href="javascript:(function()%7Bvar%20description;var%20desString=%22%22;var%20metas=document.getElementsByTagName('meta');for(var%20x=0,y=metas.length;x%3Cy;x++)%7Bif(metas%5Bx%5D.name.toLowerCase()==%22description%22)%7Bdescription=metas%5Bx%5D;%7D%7Dif(description)%7BdesString=%22&amp;amp;description=%22+encodeURIComponent(description.content);%7Dvar%20win=window.open(%22http://39.106.195.181:8080/collect-page?from=webtool&amp;url=%22+encodeURIComponent(document.URL)+desString+%22&amp;title=%22+encodeURIComponent(document.title)+%22&amp;charset=%22+document.charset,'_blank');win.focus();%7D)();" onclick="alert('请把这个按钮拖到您的浏览器书签栏'); return false;" class="btn btn-primary">收藏按钮</a>
                    <span>(将该按钮拖动至浏览器书签栏,如下图)</span>
                </div>
				<!--未读列表-->
				<div id ="noRead" th:replace="include-noRead::noRead"></div>
				<!--个人资料-->
				<div id="mypersonal-data"  th:replace="page-mypersonal::mypersonal"></div>

				<div id="follow-personal-data" th:replace="page-follow-personal::follow-personal"></div>

				<div id="personal-search" th:replace="page-search-personal::searchpersonal"></div>



				<!--查看单个人的资料-->
				<div id="allpersonal-data"  th:replace="page-allpersonal::allpersonal"></div>


				<!--关注用户资料-->
				<div class="col-lg-4 col-md-5 col-sm-5" id="personal-data"  th:replace="page-personal::personal" style="margin-left: 34%"></div>
             <!--   添加收藏-->
                <div class="col-md-6" style=" left:30%; margin-top:200px;">
                    <div id="content3" class="panel bk-bg-white" style=" display: none">
                        <div class="panel-body">
                            <div class="bk-bg-white  bk-margin-15" >
                                <h4>请输入添加的收藏夹名称:</h4>
                                <textarea id="favoriteName" type="text" class="form-control bk-noradius" placeholder="请输入收藏夹名称" style="border-color:#2a6496;margin: 20px auto; height: 40px; width: 100%; resize:none;"></textarea>
                                <div class="pull-right">
                                    <button type="button" onclick="favo()"  class="btn btn-primary"><i class="fa fa-lightbulb-o"></i> 提交</button>
                                </div>
                            </div>
                            <div class="bk-bg-white bk-margin-15">
                                <div class="btn-group">

                                </div>

                            </div>
                        </div>
                    </div>
                </div>


            </div>
            <!-- Main Page -->
</div>
<script>
function getdeleted() {
	window.location.href="/getDeletedList?userid="+localStorage.getItem("id");
}
</script>
<!-- Vendor JS-->
<script src="/vendor/js/jquery.min.js"></script>
<script src="/vendor/js/jquery-2.1.1.min.js"></script>
<script src="/vendor/js/jquery-migrate-1.2.1.min.js"></script>
<script src="/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="/vendor/skycons/js/skycons.js"></script>

<!-- Plugins JS-->
<script src="/plugins/jquery-ui/js/jquery-ui-1.10.4.min.js"></script>
<script src="/plugins/scrollbar/js/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="/plugins/bootkit/js/bootkit.js"></script>
<script src="/plugins/moment/js/moment.min.js"></script>
<script src="/plugins/fullcalendar/js/fullcalendar.min.js"></script>
<script src="/plugins/touchpunch/js/jquery.ui.touch-punch.min.js"></script>
<script src="/plugins/flot/js/jquery.flot.min.js"></script>
<script src="/plugins/flot/js/jquery.flot.pie.min.js"></script>
<script src="/plugins/flot/js/jquery.flot.resize.min.js"></script>
<script src="/plugins/flot/js/jquery.flot.stack.min.js"></script>
<script src="/plugins/flot/js/jquery.flot.time.min.js"></script>
<script src="/plugins/xcharts/js/xcharts.min.js"></script>
<script src="/plugins/autosize/jquery.autosize.min.js"></script>
<script src="/plugins/placeholder/js/jquery.placeholder.min.js"></script>
<script src="/plugins/datatables/js/dataTables.bootstrap.min.js"></script>
<script src="/plugins/datatables/js/jquery.dataTables.min.js"></script>
<script src="/plugins/raphael/js/raphael.min.js"></script>
<script src="/plugins/morris/js/morris.min.js"></script>
<script src="/plugins/gauge/js/gauge.min.js"></script>
<script src="/plugins/d3/js/d3.min.js"></script>


<!--<script src="/plugins/raphael/js/raphael.min.js"></script>
<script src="/plugins/fullcalendar/js/fullcalendar.min.js"></script>
<script src="/plugins/moment/js/moment.min.js"></script>-->

<!-- Theme JS -->

<script src="/js/core.min.js"></script>

<!-- Pages JS -->
<script src="/js/pages/index.js"></script>
<script src="/js/pages/ui-elements.js"></script>
<!-- end: JavaScript-->
<div id="mm-blocker"></div>

</body>

</html>